<!DOCTYPE html>
<html ng-app="ngMap">
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<script src="script-tags-for-development.js"></script>
<script>
angular.module('ngMap').controller('MyCtrl', function($scope) {
  this.address = "Toronto Canada";
});
</script>
</head>

<body ng-controller="MyCtrl as vm">
  <ng-map zoom="10" center="[0,0]">
    <shape id="circle" name="circle" centered="true" 
      center="{{address}}"
      stroke-color='#FF0000' stroke-opacity="0.8" stroke-weight="2" 
      radius="4000" editable="true" ></shape>
    <shape id="circle" name="circle" centered="true" 
      center="current-position"
      stroke-color='#0000FF' stroke-opacity="0.8" stroke-weight="2" 
      radius="4000" editable="true" ></shape>
  </ng-map>
  <br/>Address : <input ng-model="vm.address" />
</body>
</html>
